<template>
  <div>
    <FormPanel ref="formPanel" :list="topFilterList" :cols="3" :labelWidth="90" formType="add" :isSubmitBtn="false" columnsRef="asdasdxkpjxscxTable" @formChange="formChangeFun"></FormPanel>
    <div class="confirm-button-style" style="text-align:center;">
      <el-button size="small" type="primary" :loading="addBtnState" @click="queryClick">查 询</el-button>
    </div>
    <FilterTable
      ref="table"
      height="100"
      :columns="columns"
      columnsRef="partPartInventoryPartOverflowPartOverflowAdd"
      :fetchapi="fetchApi"
      :params="fetchParams"
      :datakey="'rows'"
      :onColumnsChange="columns => (this.columns = columns)"
      :onRowSelectChange="arr => (this.onChangeColumn = arr)"
      selectionType="single"
    ></FilterTable
    ><br />

    <FormPanel ref="form" :list="form" :cols="3" :labelWidth="100" formType="add" :isSubmitBtn="false" columnsRef="asdasdxkpjxscxTable" @formChange="formChangeFuns"></FormPanel>

    <div class="confirm-button-style" style="text-align:center;margin-top:20px;">
      <el-button type="primary" :loading="addBtnState" @click="saveDialog">确 定</el-button>
      <el-button @click="closeDialog">取 消</el-button>
    </div>
  </div>
</template>

<script>
import { dictionary } from '@/utils/dictMixin';
import { getOverflowDate, storageType, getOverflowList } from '@/api/part/partInventory/partOverflow';
export default {
  name: 'partOverflowAdd',
  mixins: [dictionary],
  data() {
    return {
      topFilterList: this.createTopFilterList(),
      columns: this.createTablelist(),
      form: this.createForm(),
      fetchApi: getOverflowDate,
      fetchParams: {},
      addBtnState: null
    };
  },
  created() {
    this.getList();
  },
  mounted() {},
  methods: {
    createTopFilterList() {
      return [
        {
          type: 'SELECT',
          label: '仓库',
          fieldName: 'store',
          // itemList:this.createDictList('1004'),
          placeholder: '请选择',
          itemList: [],
          rules: [{ required: true, message: '请选择', trigger: 'blur' }]
        },
        {
          type: 'INPUT',
          label: '配件代码',
          fieldName: 'partCode'
        },
        {
          type: 'SELECT',
          label: '配件类别',
          fieldName: 'partCategory',
          itemList: this.createDictList('8075')
        },
        {
          type: 'INPUT',
          label: '品牌',
          fieldName: 'brand'
          // itemList:this.createDictList('1004'),
        },
        {
          type: 'INPUT',
          label: '配件名称',
          fieldName: 'partName'
        },
        {
          type: 'INPUT',
          label: '备注',
          fieldName: 'remarks'
        },
        {
          type: 'INPUT',
          label: '库位',
          fieldName: 'storeHouse'
        },
        {
          type: 'INPUT',
          label: '拼音',
          fieldName: 'PY'
        }
      ];
    },
    createTablelist() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '仓库',
          dataIndex: 'store',
          sorter: true
        },
        {
          title: '库位',
          dataIndex: 'brand',
          sorter: true
        },
        {
          title: '配件代码',
          dataIndex: 'partCade',
          sorter: true
        },
        {
          title: '配件名称',
          dataIndex: 'partName',
          sorter: true
        },
        {
          title: '销售价',
          dataIndex: 'sellingPrice',
          sorter: true
        },
        {
          title: '成本价',
          dataIndex: 'costPrice',
          sorter: true
        },
        // {
        //   title: '可用库存',
        //   dataIndex: 'availableInventory',
        //   sorter: true,
        // },
        {
          title: '账面库存',
          dataIndex: 'bookInventory',
          sorter: true
        },
        {
          title: '备注',
          dataIndex: 'remarks',
          sorter: true
        }
      ];
    },
    createForm() {
      return [
        {
          type: 'SELECT',
          label: '仓库',
          fieldName: 'store',
          disabled: true,
          itemList: this.createDictList('1004')
        },
        {
          type: 'INPUT',
          label: '配件代码',
          fieldName: 'partCode',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '配件名称',
          fieldName: 'partName',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '报溢数量',
          fieldName: 'overflowNum'
          // placeholder: 1.00,
        },
        {
          type: 'INPUT',
          label: '报溢单价',
          fieldName: 'overflowPrice',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '报溢金额',
          fieldName: 'overflowAmount',
          disabled: true
        }
      ];
    },

    // 根据数据字典
    async getList() {
      this.topFilterList[0].itemList = (await storageType({})).data.map(x => ({ text: x.STORAGE_NAME, value: x.STORAGE_CODE }));
      this.form[0].itemList = (await storageType({})).data.map(x => ({ text: x.STORAGE_NAME, value: x.STORAGE_CODE }));
    },

    formChangeFun(val) {
      console.log(val);
      // this.fetchParams = Object.assign({}, this.fetchParams, val, { xhrAbort: false });
    },
    formChangeFuns() {},
    //  查询
    queryClick() {},
    // 确定
    saveDialog() {},
    //  点击取消关闭窗口
    closeDialog() {
      this.$emit('close', false);
    }
  }
};
</script>
<style lang="less" scoped></style>
